<template>

    <div class="InventoryManage-page-content">
        <div class="InventoryManage-page-form">
            <el-input v-model="formData.orderNo" style="width:300px" placeholder="订单编号" :suffix-icon="Search" />

            <el-select v-model="formData.orderStatus" clearable  style="width:300px;margin-left: 20px;"  placeholder="订单状态"   >
                <el-option v-for="item in purchaseOrderStatusEnum" :key="item.value" :label="item.text" :value="item.value" />
            </el-select>  
            <el-select v-model="formData.settleStatus" clearable style="width:300px;margin-left: 20px;" placeholder="结算状态"   >
                <el-option v-for="item in settleStatusEnum" :key="item.value" :label="item.text" :value="item.value" />
            </el-select>  
            <el-button type="primary" @click="handlePageChange(1)" style="margin-left: 20px;">查询</el-button>
          
            <div class="InventoryManage-page-form-right">
                <el-button type="primary" v-btnPermission="'btn-purchase-add'" @click="add">新建</el-button>
                <el-button type="primary" v-btnPermission="'btn-purchase-dc'" @click="exportOrderPurchaseApi" plain>导出</el-button>
            </div>
        </div>
        <div class="InventoryManage-page-table">
            <Table :columns="tableColumns" :loading="loading" :data-source="tableData" />

        </div>
        <div class="InventoryManage-page-pagination">
            <Pagination style="margin-left: auto;" :key="pageSize + 'Pagination' + currentPage" :count="total"
                :page-size="pageSize" :pageNo="currentPage" @onPagechange="handlePageChange"
                @onSizechange="handleSizeChange" />
        </div>
        <updata ref="updataRef" :data-type="dataType" @closeDrawer="getOrderPurchaseListApi" />
        <reviewPurchase ref="reviewPurchaseRef"  @closeDrawer="getOrderPurchaseListApi" />
        <refusePurchase ref="refusePurchaseRef"  @closeDrawer="getOrderPurchaseListApi" />
        <settlePurchase ref="settlePurchaseRef"  @closeDrawer="getOrderPurchaseListApi" />

    </div>

</template>

<script setup lang="ts">
import { Search } from '@element-plus/icons-vue'
import type {  TableColumn } from '@/types/table';
import type {PurchaseInfo,PurchasePagination} from '@/types/purchase'
import {getOrderPurchaseList} from '@/api/purchase'
import updata from './common/updata.vue'
import reviewPurchase from './common/reviewPurchase.vue'
import refusePurchase from './common/refusePurchase.vue'
import settlePurchase from './common/settlePurchase.vue'
import type { List as storageList } from '@/types/storage/index';
import stores from '@/store';
const storageInfo = defineProps<{ storageInfo: storageList }>();
import {exportOrderPurchase} from '@/api/exportFile'
// 订单状态PurchaseOrderStatusEnum
const purchaseOrderStatusEnum =  ref<any>(stores.useBaseDataStore().getEnumSelect('purchaseOrderStatusEnum'))
// 结算状态SettleStatusEnum
const settleStatusEnum =  ref<any>(stores.useBaseDataStore().getEnumSelect('settleStatusEnum'))



const updataRef = ref<InstanceType<typeof updata>>();
    //审核
const reviewPurchaseRef = ref<InstanceType<typeof reviewPurchase>>();
    //退款
const refusePurchaseRef = ref<InstanceType<typeof refusePurchase>>();
    //结算
const settlePurchaseRef = ref<InstanceType<typeof settlePurchase>>();

const dataType = ref<number>(0)
const loading = ref<boolean>(false)
const formData = ref<PurchasePagination>({
    orderNo:'',
    orderStatus:'',
    settleStatus:'',
    storageId:storageInfo.storageInfo.storageId,
    pageNo:1,
    pageSize:10,
})
const exportOrderPurchaseApi = async () => {
  let res = await exportOrderPurchase(formData.value);
  if(res){
    const elink = document.createElement('a');
    elink.download = '采购信息.xls';
    elink.style.display = 'none';
    const blob = new Blob([res], { type: 'application/x-msdownload' });
    elink.href = URL.createObjectURL(blob);
    document.body.appendChild(elink);
    elink.click();
    document.body.removeChild(elink);
    ElMessage.success('导出成功');
  }else {
    //ElMessage.error('导出失败');
  }
}

const add = ()=>{
    dataType.value = 0
    updataRef.value?.open(0,storageInfo.storageInfo.storageId)
}


const tableColumns: TableColumn[] = [
    {
        prop: 'orderNo',
        label: '单据编号',
        permissions:'btn-purchase-xq',

        type: 'text',
        width: 200,
        textColor:'color:#18B3AB',
        componentProps: {
            fixed: 'left',
        },
        buttonGroup: [
            {
                label: 'orderNo', type: 'text', click: (row: any) => {
                    dataType.value = 1
                    updataRef.value?.open1(row.orderId,storageInfo.storageInfo.storageId)
                }
            },
        ]
    },
    { prop: 'orderStatusText', label: '订单状态' },
    { prop: 'settleStatusText', label: '结算状态' },
    { prop: 'supplyName', label: '供应商' },
    { prop: 'managerName', label: '联系人' },
    { prop: 'managerPhone', label: '联系电话' },
    { prop: 'storageName', label: '入库药库' },
    { prop: 'drugKindCount', label: '品种数量' },
    { prop: 'totalQty', label: '采购数量' },
    { prop: 'totalAmount', label: '采购金额' },
    { prop: 'remark', label: '备注' },
    { prop: 'updateBy', label: '更新人' },
    { prop: 'updateTime', label: '更新时间' },
    {
        prop: 'action',
        label: '操作',
        type: 'action',
        width: 120,
        componentProps: {
            fixed: 'right',

        },
        buttonGroup: [
            {
                label: '详情', type: 'text',permissions:'btn-purchase-xq',click: (row: PurchaseInfo) => {
                    dataType.value = 1
                    updataRef.value?.open1(row.orderId,storageInfo.storageInfo.storageId)
                }
            },
            {
                label: '审核', permissions:'btn-purchase-sh',type: 'text', statusName: ['orderStatus'], status: '1', click: (row: PurchaseInfo) => {
                    dataType.value = 1
                    reviewPurchaseRef.value?.open(row.orderId)
                }
            },
            {
                label: '结算',permissions:'btn-purchase-js', type: 'text',statusName: ['settleStatus'], status: '1', click: (row: PurchaseInfo) => {
                    dataType.value = 1
                    settlePurchaseRef.value?.open(row.orderId)
                }
            },
           {
                label: '退款', permissions:'btn-purchase-tk', type: 'text',statusName: ['settleStatus'], status: '2',  color: '#D90000', click: (row: PurchaseInfo) => {
                    refusePurchaseRef.value?.open(row.orderId)

                }
            },
           
           
        ]
    }
]
const tableData = ref<PurchaseInfo[]>([])
const currentPage = ref(1);
const pageSize = ref(10);
const total = ref(0);
const getOrderPurchaseListApi = async()=>{
    loading.value = true
    formData.value.pageNo = currentPage.value;
    formData.value.pageSize = pageSize.value;
   let res = await getOrderPurchaseList(formData.value) 

    if(res.code != '200'){
        //ElMessage.error(res.msg);
        return
    }
    res.data.list.forEach((item: any) => {
      item.isEnabled = item.isEnabled === '1' ? '启用' : '停用';
      
      for (let index = 0; index < settleStatusEnum.value.length; index++) {
        let items = settleStatusEnum.value[index];
        if(item.settleStatus == items.value){
            item.settleStatusText = items.text
        }
      }

      for (let index = 0; index < purchaseOrderStatusEnum.value.length; index++) {
        let items = purchaseOrderStatusEnum.value[index];
        if(item.orderStatus == items.value){
            item.orderStatusText = items.text
        }
      }
      
      if(item.orderStatus == '1'){
        item.settleStatus = '0'
      }
      if(Number(item.totalAmount) > 0){
        item.totalAmount = (item.totalAmount / 100).toFixed(2)
      }
    });
    loading.value = false

   tableData.value = res.data.list
   total.value = res.data.totalCount
}
getOrderPurchaseListApi()




const handlePageChange = (page: number) => {
    currentPage.value = page;
    getOrderPurchaseListApi()
};
const handleSizeChange = (size: number) => {
    currentPage.value = 1;

    pageSize.value = size;
    getOrderPurchaseListApi()

};


</script>

<style lang="scss">
.InventoryManage {
    padding: 24px;
    height: 100%;
}

.InventoryManage-page {
    background: #fff;
    border-radius: 6px;
    height: 100%;

    .InventoryManage-page-nav {
        display: flex;
        align-items: center;
        justify-content: left;
        border-radius: 4px;
        border-bottom: 1px solid #E7E7E7;

        .el-dropdown-link {
            background: rgba(22, 173, 164, 0.08);
            border-radius: 0px 0px 0px 0px;
            padding: 16px 21px;
            cursor: pointer;
            color: var(--el-color-primary) !important;
            display: flex;
            font-size: 16px;
            align-items: center;
        }

    }

    .InventoryManage-page-content {
        padding: 21px 24px;
        height: calc(100% - 50px);

        .InventoryManage-page-form {
            display: flex;
            align-items: center;

            .InventoryManage-page-form-right {
                margin-left: auto;
            }
        }

        .InventoryManage-page-table {
            margin-top: 22px;
            height: calc(100vh - 300px);
        }

        .InventoryManage-page-pagination {
            margin-top: 24px;
            display: flex;
            align-items: center;

            .InventoryManage-page-pagination-total {
                margin-right: auto;
                font-family: Microsoft YaHei, Microsoft YaHei;
                font-weight: 400;
                font-size: 14px;
                color: rgba(0, 0, 0, 0.6);
                text-align: left;
                font-style: normal;
                text-transform: none;
            }
        }
    }

}
</style>